<template>
  <z-paging ref="paging" v-model="dataList" @query="queryList">
    <template #top>
      <u-navbar
        back-text=""
        :title="'我的' + typeObj[type]"
        :background="navBackground"
        back-icon-size="30rpx"
        :is-fixed="false"
        title-color="#000"
        back-icon-color="#000"></u-navbar>
    </template>
    <view w-full px-20rpx box-border mt-20rpx>
      <nut-swipe-group lock>
        <nut-swipe v-for="(item, index) in dataList" :name="'swipe' + index" rounded-20rpx>
          <view relative w-710rpx box-border px-20rpx mb-20rpx bg="#fff" rounded-20rpx @click="toDetail(item)">
            <view w-full py-30rpx style="border-bottom: 1px solid #eeeeee">
              <view text-32rpx font-bold>
                {{ typeObj[type] }}名称：{{ type === 1 ? item.unitName : item.schoolName }}
              </view>
              <view v-if="type === 1" text-28rpx mt-16rpx>统一社会信用代码：{{ item.creditCode }}</view>
              <view text-28rpx mt-16rpx>
                {{ typeObj[type] }}地址：{{ type === 1 ? item.unitAddress : item.schoolAdress }}
              </view>
              <view v-if="item.checkStatus === 2" text-28rpx mt-16rpx>拒绝原因：{{ item.checkReason }}</view>
            </view>
            <view
              v-if="item.familyMemberName"
              w-full
              flex
              justify-between
              items-center
              h-100rpx
              text-24rpx
              style="border-top: 1rpx solid #eee">
              已关联成员：{{ item.familyMemberName }}
            </view>
            <view
              absolute
              right-0
              top-0
              w-120rpx
              h-60rpx
              rounded-tr-20rpx
              rounded-bl-40rpx
              :style="{ backgroundColor: checkStatusBg[item.checkStatus] }"
              text-24rpx
              text="#fff"
              flex
              justify-center
              items-center>
              {{ checkStatusObj[item.checkStatus] }}
            </view>
          </view>

          <template #right>
            <view
              w-160rpx
              h-full
              flex
              flex-col
              justify-center
              items-center
              bg="#D14141"
              rounded-tr-20rpx
              rounded-br-20rpx
              @click="confirmDel(item)">
              <image w-40rpx h-40rpx mr-10rpx src="@/pages/familyMember/static/delete.png"></image>
              <view text="#fff" text-28rpx mt-16rpx>删除</view>
            </view>
          </template>
        </nut-swipe>
      </nut-swipe-group>
    </view>
    <template #empty>
      <view w-710rpx h-full flex flex-col justify-center items-center>
        <image w-670rpx h-264rpx src="@/pages/company/static/empty.png"></image>
        <view text="#7D7D7D" text-28rpx mt-40rpx>您还没有添加{{ typeObj[type] }}，点击下方按钮添加吧！</view>
      </view>
    </template>
    <template #bottom>
      <view w-full px-40rpx pb-46rpx pt-20rpx box-border>
        <view
          w-670rpx
          h-100rpx
          rounded-50rpx
          bg="#FCC300"
          flex
          justify-center
          items-center
          font-500
          text="#000"
          text-32rpx
          @click="toAdd">
          添加{{ typeObj[type] }}
        </view>
      </view>
    </template>
  </z-paging>
</template>

<script setup lang="ts">
import { selectMyUnitList, deleteUnit } from '@/api/myUnit'
import { selectMySchoolList, deleteSchool } from '@/api/mySchool'
import { onLoad, onShow } from '@dcloudio/uni-app'
import uNavbar from '@/components/navbar/index.vue'
import config from '@/config/config'
const paging = ref<any>(null)
const navBackground = ref({
  background: 'url(' + config.yellowNavBg + ') no-repeat'
})
const delInfo = ref<any>({})
const typeObj = ref<any>({
  1: '单位',
  2: '学校'
})
const checkStatusObj = ref<any>({
  0: '待审核',
  1: '通过',
  2: '未通过'
})
const checkStatusBg = ref<any>({
  0: '#FCC300',
  1: '#2AAC38',
  2: '#FF7171'
})
const type = ref<number>(1)
const dataList = ref<any>([])
function toAdd() {
  uni.navigateTo({
    url: '/pages/company/searchCompany?type=' + type.value
  })
}

function toDetail(item: any) {
  if (item.checkStatus === 1) {
    console.log('点击进入详情')
    uni.navigateTo({
      url: `/pages/company/companyDetail?id=${item.id}&type=${type.value}`
    })
  } else {
    uni.navigateTo({
      url: `/pages/company/${type.value === 1 ? 'addCompany' : 'addSchool'}?id=${item.id}`
    })
  }
}

const queryList = (pageNo: number, pageSize: number) => {
  const api = type.value === 1 ? selectMyUnitList : selectMySchoolList
  api({ pageNumber: pageNo, pageSize })
    .then((res: any) => paging.value.complete(res.data.result.records))
    .catch(() => paging.value.complete(false))
}
function del(item: any) {
  delInfo.value = item
}
function confirmDel(item: any) {
  delInfo.value = item
  uni.showModal({
    title: '提示',
    content: '是否确认删除?',
    confirmColor: '#FCC300',
    cancelColor: '#707175',
    success(res) {
      if (res.confirm) {
        const deleteAction = type.value === 2 ? deleteSchool : deleteUnit
        deleteAction(delInfo.value.id).then(() => {
          uni.showToast({
            title: '删除成功',
            icon: 'none'
          })
          paging.value.reload()
        })
      } else if (res.cancel) {
        console.log('用户点击取消')
      }
    }
  })
}

onMounted(() => {})
onShow(() => {
  if (paging.value) {
    paging.value.reload()
  }
})
onLoad((options: any) => {
  type.value = parseInt(options.type)
})
</script>
<style>
page {
}
</style>
<style scoped lang="scss"></style>
